export type TodoTaskType = {
  id: number;
  task: string;
  isDone: boolean;
};

// 7.2 定义枚举类型，表示可选范围
export enum SelectType {
  ALL = 'all',
  ACTIVE = 'active',
  COMPLETED = 'completed',
}

const initialState = {
  // 12.3 从缓存中获取初始值
  list: JSON.parse(localStorage.getItem('todo-list') || '[]') as TodoTaskType[], // 初始值可能是string 或者 null

  // 7.1 声明type，
  // 7.3 告诉ts听我的，这不是普通的字符串，是枚举之一
  type: localStorage.getItem('todo-type') || SelectType.ALL,
};

// 2.5 使用字面量+联合维护type的值
export type ActionType =
  | { type: 'todo/updateById'; payload: number }
  // 3.1 扩展ActionType的类型
  | { type: 'todo/delById'; payload: number }
  // 4.1 先扩展ActionType的类型
  | { type: 'todo/clearDone' }
  // 6.1 扩展ActionType的类型
  | { type: 'todo/add'; payload: TodoTaskType }
  // 8.1 扩展ActionType的类型
  | { type: 'todo/updateType'; payload: SelectType }
  // 11.1 扩展ActionType
  | { type: 'todo/toggleAll'; payload: boolean };

export default function todoReducer(
  state = initialState,
  // 🗝️ 在TS中，不要解构action
  action: ActionType
): // 3.6💥reducer函数一定要加上返回值类型，防止返回值错误不八错
typeof initialState {
  switch (action.type) {
    // 1.1 在reducer中定义更新的switch逻辑分支
    case 'todo/updateById':
      return {
        ...state,
        // 1.4 reducer中完成更新的计算
        list: state.list.map((item) => ({
          ...item,
          isDone: item.id === action.payload ? !item.isDone : item.isDone,
        })),
      };

    case 'todo/delById':
      // 3.2 reducer中定义switch逻辑分支
      return {
        ...state,
        // 3.5 完成删除的逻辑
        list: state.list.filter((item) => {
          return item.id !== action.payload;
        }),
      };

    case 'todo/clearDone':
      // 4.2 reducer中定义逻辑分支
      return {
        ...state,
        // 4.5 完成清除已完成的逻辑
        list: state.list.filter((item) => !item.isDone),
      };

    case 'todo/add':
      return {
        ...state,
        // 6.2 新增switch逻辑分支，完成新增的逻辑
        list: [action.payload, ...state.list],
      };
    // 8.2 新增switch逻辑分支，完成更新type的逻辑
    case 'todo/updateType':
      return {
        ...state,
        type: action.payload,
      };

    // 11.2 扩展swtich逻辑分支
    case 'todo/toggleAll':
      return {
        ...state,
        // 11.5 完成全选的计算逻辑
        list: state.list.map((item) => ({ ...item, isDone: action.payload })),
      };

    default:
      return state;
  }
}
